import React from "react";
import { Table, Switch,message } from 'antd';
import { timeToStr } from '../../../../../utils/time'
import api from "../../../../../api";


const LeaseTable = (props: any) => {
  const columns = [
    {
      title: '序号',
      dataIndex: 'number',
      key: 'number',
    },
    {
      title: '楼盘名称',
      dataIndex: 'building',
      key: 'building',
    },
    {
      title: '详细地址',
      dataIndex: 'address',
      key: 'address',
    },
    {
      title: '租金',
      dataIndex: 'rent',
      key: 'rent',
      render: (text: any) => {
        return <span>{text}/月</span>
      }
    },
    {
      title: '排序',
      dataIndex: 'sort',
      key: 'sort',
    },
    {
      title: '更新时间',
      dataIndex: 'update_time',
      key: 'update_time',
      render: (time: any) => {
        return <span>{timeToStr(time)}</span>
      }
    },
    {
      title: '状态',
      dataIndex: 'state',
      key: 'state',
      render: (state: any, item: any) => {
        return <Switch checkedChildren="正常" unCheckedChildren="异常" checked={state} onChange={() => { stateChange(item) }} />
      }
    },
    {
      title: '经纪人',
      dataIndex: 'broker',
      key: 'broker',
    },
    {
      title: '操作',
      key: "option",
      render: () => {
        return <div className="option-house">
          <span>详情</span>
          <span>编辑</span>
          <span>删除</span>
          <span>指派经纪人</span>
        </div>
      }
    },
  ];
  // 方法
  // 状态切换
  const stateChange = (item:any) => {
    api.houseChange({
      id:item.id,
      state:!item.state
    }).then((res:any)=>{
      if(res.success) {
        message.success('修改成功');
        // 重新渲染页面
        props.getHouseList();        
      } else {
        message.error(res.message);
      }
    })
  };
  return (
    <>
      {props.dataSource[0] && <Table dataSource={props.dataSource} columns={columns} rowKey={record => record.id}
        pagination={false}
      />}
    </>

  )
};

export default LeaseTable